
<!-- 本月下单出货情况 -->
<div style="margin: 15px auto;width: 150px;font-size: 16px;">近31天下单出货情况</div>
<ul class="layui-nav layui-bg-gray" data-option="31_days">
    <li class="layui-nav-item" onclick="fun_order_delivery(this,0,'金额')">&nbsp;&nbsp;金额&nbsp;&nbsp;</li>
    <li class="layui-nav-item layui-this" onclick="fun_order_delivery(this,0,'件数')">&nbsp;&nbsp;件数&nbsp;&nbsp;</li>
    <li class="layui-nav-item" onclick="fun_order_delivery(this,0,'订单个数')">&nbsp;&nbsp;订单个数&nbsp;&nbsp;</li>
    <li class="layui-nav-item layui-this" onclick="fun_order_delivery(this,1,'全部')" style="margin-left: 80%;">&nbsp;&nbsp;全部&nbsp;&nbsp;</li>
    <li class="layui-nav-item" onclick="fun_order_delivery(this,1,'针织')">&nbsp;&nbsp;针织&nbsp;&nbsp;</li>
    <li class="layui-nav-item" onclick="fun_order_delivery(this,1,'梭织')">&nbsp;&nbsp;梭织&nbsp;&nbsp;</li>
</ul>
<div id="chart_order_delivery_31_days" style="height:350px;"></div>

<!-- 上月下单出货情况 -->
<div style="margin: 15px auto;width: 150px;font-size: 16px;">上月下单出货情况</div>
<ul class="layui-nav layui-bg-gray" data-option="last_month">
    <li class="layui-nav-item" onclick="fun_order_delivery(this,0,'金额')">&nbsp;&nbsp;金额&nbsp;&nbsp;</li>
    <li class="layui-nav-item layui-this" onclick="fun_order_delivery(this,0,'件数')">&nbsp;&nbsp;件数&nbsp;&nbsp;</li>
    <li class="layui-nav-item" onclick="fun_order_delivery(this,0,'订单个数')">&nbsp;&nbsp;订单个数&nbsp;&nbsp;</li>
    <li class="layui-nav-item layui-this" onclick="fun_order_delivery(this,1,'全部')" style="margin-left: 80%;">&nbsp;&nbsp;全部&nbsp;&nbsp;</li>
    <li class="layui-nav-item" onclick="fun_order_delivery(this,1,'针织')">&nbsp;&nbsp;针织&nbsp;&nbsp;</li>
    <li class="layui-nav-item" onclick="fun_order_delivery(this,1,'梭织')">&nbsp;&nbsp;梭织&nbsp;&nbsp;</li>
</ul>
<div id="chart_order_delivery_last_month" style="height:350px;"></div>


<script type="text/javascript">
    var chart_order_delivery_last_month_data={type:'件数',sku_type:'全部'};
layui.extend({
	highcharts:'highcharts/highcharts'
})
layui.use(['jquery', 'layer', 'highcharts'], function() {
	var $ = layui.jquery;
	var layer = layui.layer;

	//上月下单出货情况
	window.chart_order_delivery_all = function(date_type){
		$.ajax({
			type: "POST",
			url: "{:url('chart_order_delivery')}",
			data: "date_type="+date_type+"&factory_id="+factoryId+"&from="+from+"&type="+chart_order_delivery_last_month_data.type+"&sku_type="+chart_order_delivery_last_month_data.sku_type,
			dataType: "json",
			success: function(res){
                var chart_order_delivery_last_month = Highcharts.chart('chart_order_delivery_'+date_type, res.data.chart);
			}
		});
	}
    chart_order_delivery_all('last_month');
    chart_order_delivery_all('31_days');
});

function fun_order_delivery(obj,flag=0,data='') {
    switch (flag) {
        case 0:
            chart_order_delivery_last_month_data.type=data;
            $(obj).parent().find('li:eq(0)').removeClass('layui-this');
            $(obj).parent().find('li:eq(1)').removeClass('layui-this');
            $(obj).parent().find('li:eq(2)').removeClass('layui-this');
            $(obj).addClass('layui-this');
            break;
        case 1:
            chart_order_delivery_last_month_data.sku_type=data;
            $(obj).parent().find('li:eq(3)').removeClass('layui-this');
            $(obj).parent().find('li:eq(4)').removeClass('layui-this');
            $(obj).parent().find('li:eq(5)').removeClass('layui-this');
            $(obj).addClass('layui-this');
            break;
    }
    chart_order_delivery_all($(obj).parent().attr('data-option'));
}
</script>